import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"
import axios from "axios";

const kind = createSlice({
    name: "kind",
    initialState: {
        proList: []
    },
    reducers: {
        addPro(state, action) {
            state.proList.push(action.payload);
        },
        removePro(state, action) {
            state.proList = state.proList.filter(item => item.proid === action.payload);
        }
    },
    extraReducers: (buidler) => {
        buidler
            .addCase(getProListAction.pending, state => {
                state.status = "loading";
            })
            .addCase(getProListAction.fulfilled, (state, action) => {
                state.status = "idle";
                // state.proList.push(...action.payload);
                state.proList=action.payload;
            })
            .addCase(getProListAction.rejected, state => {
                state.status = "failed"
            })
    }
});

// 对外暴露：actions
export const { addPro, removePro } = kind.actions;

// 异步操作：用createAsyncThunk

export const getProListAction = createAsyncThunk('kind/getProList', async (count) => {
    const res = await axios({
        url: "http://121.89.205.189:3000/api/pro/list",
        params:{
            count:count
        }
    })
    return res.data.data
})


// 对外暴露reducer
export default kind.reducer;

// {
//     "link": "2",
//     "alt": "2",
//     "img": "https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics0.baidu.com%2Ffeed%2F78310a55b319ebc4c061c377e7b56ff01f171666.jpeg%40f_auto%3Ftoken%3Db32023b11c69bd3889c56d2e2142c271&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1692118800&t=301d10ca47f0f885909f32b29f5f4bbc",
//     "bannerid": "banner_351aa6ff-7017-4dd5-90a2-6eb8cf9e11b5",
//     "flag": true
// },